<template>
<!-- 添加用户 -->
    <div style="padding-left:35%">
      <el-row v-for="item in settings" :key="item.id">
        <el-col :span="6"><div class="grid-content"></div></el-col>
        <el-col :span="6" style="margin-top:9px">
          <div class="grid-content" style="font-size: 20px;">{{item.desc+":"}}</div>
        </el-col>
        <el-col :span="6">
          <div class="grid-content">
            <el-input v-model="item.value" placeholder="请输入内容" @blur="editSetting(item.id)"></el-input>
          </div>
        </el-col>
        <el-col :span="6"><div class="grid-content" style="height:60px"></div></el-col>
      </el-row>
    </div>
</template>
<script>
import Qs from "qs"
  export default {
    data() {
      return {
        settings:[],
      };
    },
    created(){
      this.getSetting();
    },
    methods: {
      async getSetting(){
         const res = await this.$http.get("/property/getAllProperty")
         this.settings=res.data.data;
      },
      editSetting(id){
         this.settings.forEach( async (element) => {
          if(element.id === id){
            const res = await this.$http.post("/property/update",Qs.stringify(element))
            if(res.data.code == 200){
               this.$message({
                  message: '修改成功',
                  type: 'success'
                });
            }else{
              this.$message.error("修改配置失败");
            }
            return;
          }
        });
      }
    },
   
  }
</script>

<style scoped>
.grid-content{
  width: 100%;
  min-width: 100%;
}
el-row{
  margin-top: 40px;
  padding: 40px;
}
</style>